<template>
	<div class="nav-footer">
	<tabbar :index.sync="selectIndex">
      <tabbar-item v-for="item in navList" @click="selectIndex = 0" v-bind:link="item.path">
        <img slot="icon" v-bind:src="item.img">
        <span slot="label">{{item.text}}</span>
      </tabbar-item>
    </tabbar>

	</div>
</template>
<script>
import XHeader from 'vux-components/x-header'
import {Tabbar,TabbarItem} from 'vux-components/tabbar'
export default {
		name: 'navfooter',
		components: {
			XHeader,
			Tabbar,
			TabbarItem
		},
		data () {
		    return {
		      navList:[{
		        img:'../assets/images/app/icon_nav_button.png',
		        text:'1',
		        path:'/module1'
		      },
		      {
		        img:'../assets/images/app/icon_nav_icons.png',
		        text:'2',
		        path:'/module2'
		      },
		      {
		        img:'../assets/images/app/icon_nav_cell.png',
		        text:'3',
		        path:'/module3'
		      },
		      {
		        img:'../assets/images/app/icon_nav_actionSheet.png',
		        text:'我',
		        path:'/module4'
		      }],
		      selectIndex:0
	    }
  },
	}
</script>
<style lang="scss">
  .nav-footer{
    background: red;
  }
</style>


